<template>
    <div class="tabs-container mb20">
        <label>{{labelText}}:</label>
        <ul class="sort-ul">
            <li v-for="(item,index) in tabsList" :key="index">{{item.txt}}</li>
        </ul>
    </div>
</template>

<script>
export default {
    props: ['labelText','tabsList']
}
</script>

<style scoped lang="less">
    .tabs-container{
        display: flex;
        align-items: center;

        label{
            font-family: SourceHanSansSC-Bold;
            font-size: 16px;
            font-weight: normal;
            font-stretch: normal;
            line-height: 23px;
            letter-spacing: 0px;
            color: #333333;
            padding-right: 14px;
            box-sizing: border-box;
        }

        .sort-ul{
            display: flex;
            li{
                padding-right: 26px;
                font-family: SourceHanSansSC-Light;
                font-size: 16px;
                font-weight: normal;
                letter-spacing: 0px;
                color: #999999;
                box-sizing: border-box;
                cursor: pointer;
            }
        }
    }
</style>
